import { formatDate } from '@/utils/util'
export const TableMixin = {
  data() {
    return {
      searchForm: {
        pageNo: 1,
        pageSize: 10,
        pageSizeOptions: ['10', '20', '30', '40', '50'],
        showTotal: (total, range) => {
          return range[0] + '-' + range[1] + ' 共' + total + '条'
        },
        total: 0,
      },
      labelCol: { span: 8 },
      wrapperCol: { span: 15 },
      selectedRowKeys: [],
      selectedRows: [],
      records: [],
      showSearchForm: false,
      loading:false
    }
  },
  methods: {
    customRow(record) {
      return {
        on: {
          dblclick: (event) => {
            if (!this.selectedRowKeys) {
              this.selectedRowKeys = []
              this.selectedRows = []
            }
            if (this.selectedRowKeys.indexOf(record.id) <= -1) {
              this.selectedRows.push(record)
              this.selectedRowKeys.push(record.id)
            } else {
              let index = this.selectedRowKeys.indexOf(record.id)
              this.selectedRowKeys.splice(index, 1)
              this.selectedRows.splice(index, 1)
            }
          },
        },
      }
    },
    fetchList(){
      
    },
    pageChange(pageNo, pageSize) {
      this.$set(this.searchForm, 'pageSize', pageSize)
      this.$set(this.searchForm, 'pageNo', pageNo)
      this.fetchList()
    },
    onShowSizeChange(pageNo, pageSize) {
      this.searchForm.pageNo = 1
      this.searchForm.pageSize = pageSize
      this.fetchList()
    },
    onSelectChange(selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
    },
    customCellRender(width) {
      return {
        style: {
          width: width + 'px',
          overflow: 'hidden',
          whiteSpace: 'nowrap',
          textOverflow: 'ellipsis',
          cursor: 'pointer',
        },
      }
    },
    tooltipRender(text, record) {
      return (
        <a-tooltip placement="topLeft" title={text}>
          {text}
        </a-tooltip>
      )
    },
    tooltipActiveRender(text, record, funcName) {
      let dataJson = JSON.stringify(record)
      return (
        <a-tooltip placement="topLeft" title={text}>
          <span
            class="font-active"
            style="color:#249af4;cursor: pointer;"
            data={dataJson}
            funcName={funcName}
            v-on:click={this.tooltipActiveCall}
          >
            {text}
          </span>
        </a-tooltip>
      )
    },
    tooltipActiveCall(e) {
      let funcName = e.target.getAttribute('funcName')
      let dataJson = e.target.getAttribute('data')
      this.$options.methods[funcName].bind(this)(JSON.parse(dataJson))
    },
    timeRender(text, record, formatStr) {
      if (text) {
        text = formatDate(text, formatStr)
        return <span>{text}</span>
      } else {
        return <span></span>
      }
    },
    indexRender(text, record, index) {
      return index + 1
    },
    openSearchForm() {
      this.showSearchForm = true
    },
    hideSearchForm() {
      this.showSearchForm = false
    },
    handleTableChange(searchForm, filters, sorter) {
      this.searchForm = searchForm
      this.fetchList()
    },
  },
}
